﻿{extend name="common/base"}
{block name="title"}领券中心{/block}

<body>

{block name="content"}

	<!-- product list -->
	<div class="product-list segments-page" style="margin: 0px auto">
		<div class="container" style="margin: 0px auto">
			<div class="content no-bb">
				<div class="pages-title">
					<h4>领券中心</h4>
				</div>
				{volist name="coupon_list" id="val"}
				<div class="product-image">
					<img src="__STATIC__/index/images/Coupon_cx.png" alt="">
				</div>
				<div class="product-text">
					<h5>¥{$val.coupon_money}</h5>
					<p>{$val.coupon_name}</p>					
					<p>使用起始日期 : {$val.use_start_time}</p>
					<p style="margin-top:-10px;">使用结束日期 : {$val.use_end_time}<button onclick="getCoupon(this);" style="margin-left:5px;{if condition="in_array($val.id,$hasCoupon_ids)"}background-color:gray;{/if}" class="button coupon-id" id="coupon{$val.id}" {if condition="in_array($val.id,$hasCoupon_ids)"}disabled{/if}>{if condition="in_array($val.id,$hasCoupon_ids)"}已领取{else/}领取 {/if}</button></p>									
				</div>
				<div class="clear"></div>
				{/volist}
			</div>			
		</div>
	</div>
	<!-- end product list -->
{/block}

<script src="__STATIC__/index/js/jquery.min.js"></script>
<script src="__STATIC__/index/js/materialize.js"></script>
<script src="__STATIC__/index/js/owl.carousel.min.js"></script>
<script src="__STATIC__/index/js/main.js"></script>
</body>
{block name="footjs"}
<script>
function getCoupon(obj){       
	var coupon_id = $(obj).attr('id').substring(6);
	$.ajax({
		url:"{:url('index/coupon/getCoupon')}",
		type:"post",
		data:{coupon_id:coupon_id},
		dataType:"json",
		success:function(data){                
			console.log(data)	
			if(data.data==2){
				$(obj).attr('style','margin-left:5px;background-color:gray;')
				$(obj).attr('disabled','disabled')
				$(obj).html('已领取');
			}		
		}
	});
}
</script>
{/block}
</html>
